<!DOCTYPE html>
<html <?php if($list['result'] == false):?> <?php elseif($list['result'] == true && $list['list']):?>class="has"<?php else:?> class="no" <?php endif;?>>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection" />
    <meta content="emai=no" name="format-detection" />
    <link rel="stylesheet" type="text/css" href="/css/common.css" />
    <link rel="stylesheet" type="text/css" href="/css/form.css" />
    <title>搜索报告</title>
    <style>
		html {
			background-color: #fff;
		}

		form {
			background-color: #f8f8f8;
			border-bottom: 1px solid #e2e2e2;
			position: relative;
			margin-top: 0;
			padding: 25px 0;
		}

			form input[type="tel"], form input[type="text"], form input[type="number"] {
				-moz-border-radius: 100px;
				-webkit-border-radius: 100px;
				border-radius: 100px;
				background-color: #fdfdfd;
				border: 1px solid #e2e2e2;
				-moz-box-sizing: border-box;
				-webkit-box-sizing: border-box;
				box-sizing: border-box;
				display: block;
				font-size: 1.7rem;
				height: 55px;
				margin: 0 auto;
				max-width: 635px;
				padding: 0 20px;
				width: 85%;
			}

			form input[type="tel"], form input[type="text"] {
				margin-bottom: 10px;
			}

			form button[type="submit"] {
				margin-top: 25px;
				max-width: 450px;
				width: 60%;
			}
		#login_geticode {
			background-color:#ff8960;
			bottom:127px;
			border:0;
			-moz-border-radius: 50px;
			-webkit-border-radius: 50px;
			border-radius: 50px;
			height: 40px;
			padding:0 10px;
			position:absolute;
			right:10%;
		}
		#login_geticode.disabled{			
			background-color:#fec7b4;
		}

		.no-result {
			background-color: #f4f4f4;
			padding: 50px 0;
			border-bottom: 1px solid #e2e2e2;
			margin-bottom: -16px;
			margin-top: 0;
		}

	.no-result img {
				max-width: 750px;
				width: 100%;
			}

		.notice {
			padding: 0;
			margin-top: 15%;
			text-align: center;
		}

			.notice img {
				width: 18.3%;
			}

		#result, #recommend {
			border-top: 15px solid #f4f4f4;
		}

			#result header, #recommend header {
				background: transparent url('/img/icon_report.png') no-repeat 4% center;
				background-size: auto 46%;
				border-bottom: 1px solid #e2e2e2;
				color: #999;
				font-size: 1.6rem;
				padding-left: 11%;
			}

			#result ul {
				margin-left: 7.5%;
				width: 92.5%;
			}

			#result li {
				border-bottom: 1px solid #e2e2e2;
				font-size: 1.7rem;
				line-height: 1.5;
				padding: 15px 5px 15px 2.5%;
			}

				#result li:last-child {
					border: none;
				}

			#result .i-viewAll {
				float: right;
				height: 21px;
			}

			#recommend header {
				background-image: url('/img/icon_recommend.png');
			}

		.c-list .c-list-item {
			border-top: 1px solid #e2e2e2;
			padding: 17px 3.5% 17px 0;
			margin-left: 3.5%;
		}

			.c-list .c-list-item:first-child {
				border-top: none;
			}

		.c-list .c-list-left {
			width: 30%;
			position: relative;
		}

			.c-list .c-list-left > img {
				display: inherit;
				width: 100%;
			}

		.c-list .c-list-right {
			padding-left: 15px;
		}

		.c-list .c-list-title {
			font-size: 1.6rem;
			display: -webkit-box;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: normal;
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
			line-height: 1.5;
		}
	</style>
	<script>
	var _hmt = _hmt || [];
	(function() {
	  var hm = document.createElement("script");
	  hm.src = "//hm.baidu.com/hm.js?19f39b206aedf768b42fbc69e4e4f721";
	  var s = document.getElementsByTagName("script")[0]; 
	  s.parentNode.insertBefore(hm, s);
	})();
	</script>
</head>
<body>
    <div class="wrapper">
        <form action="" method="get">
            <input type="tel" id="form-telephone" name="mobile" value="<?php echo $mobile?>" placeholder="购买人手机号" data-message="购买人手机号不能为空" />
            <input type="text" id="form-name" name="name" value="<?php echo $name;?>" placeholder="受检人姓名" data-message="受检人姓名不能为空" />
            <input type="tel" id="form-code" name="code" value="" placeholder="请输入验证码" data-message="验证码不能为空" maxlength="4" />
			<button type="button" id="login_geticode">获取验证码</button>
            <button type="submit" id="form-submit">点击搜索</button>
        </form>
        
		<?php if($list['list'] && $list['result'] == true):?>
		<div id="result">
		<header>以下是搜索结果：</header>
        <ul>
        	<?php foreach ($list['list'] as $item):?>
            <li <?php if($item['file']):?>data-href="/order/offlinereport?id=<?php echo $item['report_id']?>"<?php endif;?>><span class="icon i-viewAll"></span><?php echo $item['content']?></li>
            <?php endforeach;?>
        </ul>
        </div>
        <?php elseif($list['result'] == true):?>
        <div class="no-result">
            <img src="/img/no_report.png" />
        </div>
        <?php endif;?>
        
        <!--强烈推荐-->
		<div id="recommend">
			<header>强烈推荐：</header>
			<ul class="c-list">
				<li class="c-list-item" data-href="http://wx.zhishimama.com/source-statistics/index?id=76">
					<div class="flex-wrapper flex-align-center">
						<div class="c-list-left">
							<img src="/img/star.gif" />
						</div>
						<div class="c-list-right flex-1">
							<p class="c-list-title interception">没想到你的宝宝未来会是这样。。。</p>
						</div>
					</div>
				</li>
				
				<li class="c-list-item" data-href="http://wx.zhishimama.com/source-statistics/index?id=23">
					<div class="flex-wrapper flex-align-center">
						<div class="c-list-left">
							<img src="/img/b_wcq.jpg" />
						</div>
						<div class="c-list-right flex-1">
							<p class="c-list-title interception">做无创有问题 来专属交流群找专家！</p>
						</div>
					</div>
				</li>
			</ul>
		</div>
        
        
    </div>
    <script src="/js/zepto-1.1.6.js" type="text/javascript"></script>
    <script src="/js/common.js" type="text/javascript"></script>
    <script>
		Zepto(function ($) {
			var enalbeGeticode = true;
			baiaimama.validated = true;
			if ($('#login_geticode').length > 0) {
				$('#login_geticode').click(function (e) {
					baiaimama.validated = true;
					validateInput("form-telephone");
					validatePhone("form-telephone");
					validateInput("form-name");
					if (!baiaimama.validated) { return false; }
					var phone = $.trim($('input[name="mobile"]').eq(0).val());
					if (!/^1[1-9]\d{9}$/.test(phone) && enalbeGeticode) {
						baiaimama.Toast.New('手机号格式不正确');
						return;
					}
					if (enalbeGeticode) {
						enalbeGeticode = false;

						$.ajax({
							url: "/order/send",
							type: "post",
							dataType: "json",
							data: {user_name: $("#form-name").val(), mobile: phone},
							success: function(res){
								baiaimama.Toast.New(res.msg);
							}
						});
						
						var i = 60;
						var obj = $(this);
						obj.text(i + '秒后重试').addClass('disabled');
						var intval = setInterval(function () {
							i -= 1;
							obj.text(i + '秒后重试');
							if (i <= 0) {
								clearInterval(intval);
								obj.text('获取验证码').removeClass('disabled');
								enalbeGeticode = true;
								return;
							}
						}, 1000);
					}
				});
			}
			$("button[type='submit']").click(function (e) {
				baiaimama.validated = true;
				e.preventDefault();
				validateInput("form-telephone");
				validatePhone("form-telephone");
				validateInput("form-name");
				validateInput("form-code");
				var code = $("#form-code").val();

				if(!/^\d{4}$/.test(code))
				{
					baiaimama.validated = false;
					baiaimama.Toast.New("验证码为4位数字");
				}
				
				if (baiaimama.validated) {
					var user_name = $("#form-name").val();
					var mobile = $("#form-telephone").val();
					
					//ajax校验验证码
					$.ajax({
						url: "/order/validcode",
						type: "post",
						dataType: "json",
						data: {user_name: user_name, mobile: mobile, code: code},
						success: function(res){
							if(res.error == 0)
							{
								$("form").submit();
							}
							else
							{
								baiaimama.Toast.New(res.msg);
							}

						}
						

					});
					
					
				}
			});
		});
	</script>
</body>
</html>
